{extend name="common/base" /}

{block name="title"}
走心更走胃-留言板
{/block}

{block name="css"}
<link rel="stylesheet" href="/static/css/comment.css">
{/block}

{block name="main"}
<div class="message">
    <!-- 留言部分开始 -->
    <div class="m-t">欢迎留言<i>Welcome to leave your messages</i></div>
    <div class="m-c">
        <div class="m-t">
            <dl>留言板</dl>
            <dt>发表您的留言</dt>
            {if condition="$Think.session.commentError"}
            <dt>{$Think.session.commentError}</dt>
            {/if}
        </div>
        <form action="/comment" method="post">
            <div class="m-c">
                <textarea name="content" rows="10" cols="145"></textarea>
            </div>
            {if condition="$Think.cookie.uid"}
            <input type="submit" value="发表" style="cursor:pointer;" class="submit">
            {else /}
            <input type="button" value="发表" style="cursor:pointer;" onclick="alert('您还没登录，请先登录~');location.href='/login'">
            {/if}
        </form>
    </div>
    <!-- 留言部分结束 -->
    <!-- 留言显示部分开始 -->
    <div class="m-b">
        <dl>留言(<span>{$comments->total()}</span>条)</dl>
        {volist name="comments" id="comment"}
        <div class="content">
            {$comment->content} {if condition="$Think.session.user.id == $comment['user_id']"}
            <p class="delete" onclick="del({$comment->id})" data-id="">删除</p>
            {/if}
        </div>
        {/volist}
        <div class="content">
            {$page}
        </div>
    </div>
    <!-- 留言显示部分结束 -->
</div>
{/block}

{block name="js"}
<script>
    function del(id) {
        if(confirm('确认删除么？')) {
            $.ajax({
                url: '/comment',
                method: 'delete',
                data: {id: id},
                success: function(res) {
                    if(res.code > 0) {
                        alert(res.msg)
                        location.reload();
                    }else {
                        alert(res.msg)
                    }
                }
            })
        }
    }
    (function () {
        $('textarea').val('')
        setTimeout(function () {
            $('.m-t dt').eq(1).fadeOut()
        }, 2000)
    })()
</script>
{/block}
